import React from 'react';
import styled from 'styled-components';
import ImageCommon from "../../assets/image/common/ImageCommon";
import { useLogo } from '../../state/logoaction/hooks';

const Logo: React.FC = () => {
    const logo = useLogo();
  return (
    <StyledLogo>
        <img src={logo} height={'26px'}/>
    </StyledLogo>
  );
};


const StyledTopBarpc = styled.div`
display: block;
@media (max-width: 768px) {
  display: none;
};
`

const StyledTopBarh5 = styled.div`
display: none;
@media (max-width: 768px) {
  display: block;
};
`;

const StyledLogo = styled.div`
  align-items: center;
  display: flex;
  @media (max-width: 768px) {
    transform:scale(0.8);
  };
`;

const StyledLink = styled.a`
  color: ${(props) => props.theme.color.grey[100]};
  text-decoration: none;
  font-size: 18px;
  font-weight: 700;
  margin-left: ${(props) => props.theme.spacing[2]}px;
`;

export default Logo;
